<form class="form-horizontal">
    <h3>{{ _('Temperature Graph') }}</h3>
    <div class="control-group">
        <label class="control-label">{{ _('Graph cutoff') }}</label>
        <div class="controls">
            <div class="input-append">
                <input type="number" class="input-mini text-right" data-bind="value: temperature_cutoff">
                <span class="add-on">min</span>
            </div>
            <span class="help-block">{{ _('Needs a restart of OctoPrint to become active.') }}</span>
        </div>
    </div>
    <h3>{{ _('Temperature Presets') }}</h3>
    <div class="row-fluid">
        <div class="offset4 span3"><h4>{{ _('Extruder') }}</h4></div>
        <div class="span3"><h4>{{ _('Bed') }}</h4></div>
    </div>
    <div data-bind="foreach: temperature_profiles">
        <div class="row-fluid" style="margin-bottom: 5px">
            <div class="span4">
                <input type="text" class="span12 text-right" data-bind="value: name">
            </div>
            <div class="input-append span3">
                <input type="number" class="input-mini text-right" data-bind="value: extruder">
                <span class="add-on">&deg;C</span>
            </div>
            <div class="input-append span3">
                <input type="number" class="input-mini text-right" data-bind="value: bed">
                <span class="add-on">&deg;C</span>
            </div>
            <div class="span2">
                <a title="Remove profile" class="btn btn-danger" data-bind="click: $parent.removeTemperatureProfile"><i class="icon-trash"></i></a>
            </div>
        </div>
    </div>
    <div class="row-fluid">
        <div class="offset10 span2">
            <a title="Add Profile" class="btn btn-primary" data-bind="click: addTemperatureProfile"><i class="icon-plus"></i></a>
        </div>
    </div>
</form>
